<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:pe="http://primefaces.org/ui/extensions"
	xmlns:p="http://primefaces.org/ui">

<h:head>
</h:head>

<h:body>
	<h:outputStylesheet library="css" name="workoutJournal.css" />
	<h1>Edzés napló</h1>
	<h:form id="workoutJournalForm">
		<p:growl id="messages" />
		<p:schedule id="schedule"
			value="#{workoutJournalController.eventModel}" locale="hu"
			widgetVar="scheduleWidget">
			<p:ajax event="dateSelect"
				listener="#{workoutJournalController.onDateSelect}"
				update=":createDialog" oncomplete="PF('createDialogWidget').show()" />
			<p:ajax event="eventSelect"
				listener="#{workoutJournalController.onEventSelect}"
				update=":detailsDialog"
				oncomplete="PF('detailsDialogWidget').show()"
				onerror="alert('error');" />
			<p:ajax event="eventMove"
				listener="#{workoutJournalController.onEventMove}" update="messages" />
		</p:schedule>
	</h:form>

	<p:dialog id="createDialog" widgetVar="createDialogWidget"
		closeOnEscape="true" resizable="false" header="Új bejegyzés" dynamic="true"
		showEffect="clip" hideEffect="clip">
		<h:form>
			<h:panelGrid id="createDetails" columns="2">
				<p:outputLabel for="workout" value="Edzés" />
				<p:selectOneMenu id="workout"
					value="#{workoutJournalController.entry.workout}">
					<f:converter binding="#{workoutConverter}" />
					<f:selectItems value="#{workoutJournalController.findWorkouts()}" />
				</p:selectOneMenu>

				<p:outputLabel for="from" value="Mikor" />
				<p:calendar id="from" value="#{workoutJournalController.entry.date}" showButtonPanel="true"
					locale="hu" stepMinute="15" pattern="yyyy.MM.dd HH:mm" />
			</h:panelGrid>
			<p:commandButton id="addButton" value="Mentés" icon="ui-icon-disk"
				actionListener="#{workoutJournalController.addEvent}"
				onsuccess="PF('scheduleWidget').update();PF('createDialogWidget').hide();">
			</p:commandButton>
		</h:form>
	</p:dialog>

	<p:dialog id="detailsDialog" widgetVar="detailsDialogWidget" header="#{workoutJournalController.readonlyEntry != null ? workoutJournalController.readonlyEntry.workout.name : ''}"
		showEffect="clip" hideEffect="clip" closeOnEscape="true" dynamic="true" 
		resizable="false">
		<h:form>
			<p:fieldset>
				<h:outputText
					value="Elégetett kalória: #{workoutJournalController.readonlyEntry.workout.sumBurntCalories} kcal" />
				<br />
				<h:outputText
					value="Szükséges idő: #{workoutJournalController.readonlyEntry.workout.sumMinutes} perc" />
			</p:fieldset>
			<p:carousel id="activities" styleClass="workoutDetailsCarousel"
				value="#{workoutJournalController.readonlyEntry.workout.workoutEntries}"
				numVisible="1" var="entry">
				<f:facet name="header">  
					            Gyakorlatok
					   			 </f:facet>
				<h:panelGrid columns="1">
					<h:outputText value="#{entry.activity.name}" styleClass="entryName" />
					<h:outputText value="Sorozat: #{entry.series}" />
					<h:outputText value="Ismétlés: #{entry.iteration}" />
					<h:outputText value="Idő: #{entry.minutes} perc" />
					<h:outputText value="#{entry.details}" />
					<p:commandButton id="selectButton" update="@this :workoutDlg" process="@this :workoutDlg"
						rendered="#{entry.activity.description != null}"
						oncomplete="PF('workoutDialog').show()" icon="ui-icon-search">
						<f:setPropertyActionListener value="#{entry.activity}"
							target="#{workoutJournalController.selectedActivity}" />
					</p:commandButton>
				</h:panelGrid>

				<f:facet name="footer">  
					            Összesen: #{workoutJournalController.readonlyEntry.workout.workoutEntries.size()}  
					   			 </f:facet>
			</p:carousel>

		</h:form>

	</p:dialog>

	<p:dialog header="#{workoutJournalController.selectedActivity.name}"  
		widgetVar="workoutDialog" resizable="false" id="workoutDlg" dynamic="true"
		modal="true" draggable="false" maximizable="true" width="700"
		height="700" closeOnEscape="true">

		<h:outputText
			value="#{workoutJournalController.selectedActivity.description}" 
			escape="false" />
	</p:dialog>
</h:body>
</html>